<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>权限管理</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <link href="/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <link href="/css/animate.css" rel="stylesheet">
    <link href="/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="/css/multi-select.css" media="screen" rel="stylesheet" type="text/css">

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>分权管理员列表</h5>
                </div>
                <div class="ibox-content">

                    <table class="table table-bordered">
                        <thead>
                        <tr>
                            <th>编号</th>
                            <th>姓名</th>
                            <th>手机号</th>
                            <th style="min-width: 40%">管理的读书会</th>
                        </tr>
                        </thead>
                        <tbody>
                        {{range $i,$row := .userlist}}
                        <tr>

                            <td>{{$row.User.Id}}</td>
                            <td><a title="点击编辑权限" href="/users/permission?UserId={{$row.User.Id}}">{{$row.User.Username}}</a>
                            </td>
                            <td>{{$row.User.Phone}}</td>
                            <td>
                                {{range $n,$v := $row.Dushuhui}}
                                <span class="badge badge-primary" title="{{$v.Id}}">{{$v.CityName}}</span>
                                {{else}}
                                未分配任何读书会
                                {{end}}
                            </td>
                        </tr>
                        {{else}}
                        <tr>
                            <td>尚未分配分权管理员</td>
                        </tr>
                        {{end}}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    {{if .disable}}
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>读书会选择列表</h5>
                </div>
                <div class="ibox-content">
                    <div class="form-group">
                        <label class="col-md-1 control-label">姓名：{{.name}}</label>
                        <label class="col-md-1 col-md-offset-1 control-label">手机号：</label>
                        <div class="col-md-5">
                            <input id="Phone" name="Phone" type="tel" class="form-control" placeholder="请在此输入手机号"
                                   disabled value="{{.phone}}">
                        </div>
                        <div class="col-md-offset-1 col-md-2">
                            <button type="button" id="submit" class="btn btn-info" onclick="submitPermission()">提交
                            </button>
                        </div>
                    </div>
                    <div style="padding-top: 45px;" class="row">
                        <div class="col-md-offset-2 col-md-8">
                            <select id='selected-options' multiple='multiple'>
                                {{range .unmatched}}
                                <option value='{{.Id}}'>{{.CityName}}</option>
                                {{end}}
                                {{range .matched}}
                                <option value='{{.Id}}' selected>{{.CityName}}</option>
                                {{end}}
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{end}}

</div>

<!-- 全局js -->
<script src="/js/jquery.min.js?v=2.1.4"></script>
<script src="/js/bootstrap.min.js?v=3.3.6"></script>


<!-- 自定义js -->
<script src="/js/content.js?v=1.0.0"></script>
<script src="/js/plugins/sweetalert/sweetalert.min.js"></script>

<!-- Peity -->
<script src="/js/plugins/peity/jquery.peity.min.js"></script>

<!-- Peity -->
<script src="/js/demo/peity-demo.js"></script>
<script src="/js/jquery.multi-select.js" type="text/javascript"></script>

<script>
    $('#selected-options').multiSelect({
        selectableHeader: "<div class='custom-header'>待选择列表</div>",
        selectionHeader: "<div class='custom-header'>已选择列表</div>"
    });

    function submitPermission() {
            $.post("/users/addpermission",{"phone":$("#Phone").val(),"CityIds":$("#selected-options").val()},function(result){
                if (result.Code==0){
                    swal({title: "修改成功!",
                        text: ""},function () {
                        location.reload();
                    });
                }else{
                    swal("修改失败!", result.Data);
                }
            });
    }




</script>
</body>

</html>
